<template>
    <div class="navplugin">
        <!--内容头部-->
       <div class="sec-top d-flex ai-center jc-between">
           <h2 class="sec-name"><a href="">{{spt.title}}</a></h2>
           <div class="sec-tabs">
               <!--<ul class="d-flex ai-center jc-around" :class="{show:spt.name}">-->
                   <!--<li  v-for="(item,i) in spt.name" :key="i"><a href="">{{item}}</a></li>-->
               <!--</ul>-->
               <ul class="d-flex ai-center jc-around" >
                   <li  v-for="(item,i) in spt.name" :key="i"><a href="">{{item}}</a></li>
               </ul>
           </div>
       </div>
        <!--内容中部-->
       <div class="sec-content">
           <article v-for="(item,i) in a" :key="i" class="newsCard">
               <!--如果是需要置顶的就是上面这个a标签-->
               <a :href="item.link" v-if="item.imgsrc3gtype==2" class="topArt">
                   <h3 class="title">{{item.title}}</h3>
                   <div class="news-pic">
                       <img :src="option.url+'?imageView&thumbnail=234y146&quality=45&interlace=1&enlarge=1&type=webp'" alt="" v-for="(option,ar) in item.picInfo" :key="ar">
                   </div>
                   <div class="detail">
                       <span class="news-tag" >{{item.tag}}</span>
                       <span class="news-source">{{item.source}}</span>
                       <span class="pubtime">4小时前</span>
                       <span class="reply">{{item.tcount}}跟帖</span>
                   </div>

               </a>
               <!--否则就是下面这个a标签-->
               <a :href="item.link" v-else class="bomArt">
                   <div class="news-info">
                       <h3 class="title">{{item.title}}</h3>
                       <div class="detail">
                           <span class="news-tag" >{{item.tag}}</span>
                           <span class="news-source">{{item.source}}</span>
                           <span class="pubtime">4小时前</span>
                           <span class="reply">{{item.tcount}}跟帖</span>
                       </div>
                   </div>
                   <div class="news-pic">
                       <img :src="option.url+'?imageView&thumbnail=234y146&quality=45&interlace=1&enlarge=1&type=webp'" alt="" v-for="(option,ar) in item.picInfo" :key="ar">
                   </div>
               </a>
           </article>

       </div>
        <!--内容底部-->
        <div class="sec-bottom">
            <a href="">进入{{spt.title}}频道></a>
        </div>

    </div>
</template>

<script>
    export default {
        name: "Nav.vue",
        props:["spt","cotary"],
        data(){
            return {
                a:null,
                onOff:true
            }
        },
        computed:{

        },
        methods:{
            getJsp(){
                this.$jsonp('https://3g.163.com/touch/api/pagedata/index_yaowen').then(popData=>{
                    if(popData){
                        //console.log(popData)
                        this.a=popData.data[this.cotary]
                        //console.log(this.a)
                    }
                })
            }
        },
        created() {
            this.getJsp()
        }
    }
</script>

<style scoped>


</style>